<template>
  <div class="app-container">
    <el-tabs :value="activeTab" @tab-click="changeTab">
      <el-tab-pane v-if="roleCheck('member-info')" name="one">
        <span slot="label">代理信息</span>
        <user-info v-show="activeTab==='one'" :member="member"/>
      </el-tab-pane>
      <el-tab-pane v-if="roleCheck('trade-info')" label="交易信息" name="two">
        <user-trade :member="member" v-show="activeTab==='two'"/>
      </el-tab-pane>
      <el-tab-pane v-if="roleCheck('login-log')" label="登录日志" name="three">
        <user-login-logs v-show="activeTab==='three'"/>
      </el-tab-pane>
      <el-tab-pane v-if="roleCheck('arbitrage-query')" label="套利查询" name="four">
        <user-arbitrage v-show="activeTab==='four'"/>
      </el-tab-pane>
      <el-tab-pane v-if="roleCheck('bank-info')" label="银行信息" name="five">
        <user-bank-logs v-show="activeTab==='five'"/>
      </el-tab-pane>
      <el-tab-pane v-if="roleCheck('operation-log')" label="操作记录" name="six">
        <user-operate-logs v-show="activeTab==='six'"/>
      </el-tab-pane>
      <el-tab-pane v-if="roleCheck('address')" label="我的地址" name="my-address">
        <my-address v-show="activeTab==='my-address'"/>
      </el-tab-pane>
      <el-tab-pane label="被授信记录" v-if="roleCheck('set-record')" name="setting-record">
        <setting-record v-show="activeTab==='setting-record'"/>
      </el-tab-pane>
      <el-tab-pane label="代充清算记录" v-if="roleCheck('clear-record')" name="credit-clear">
        <credit-clear v-show="activeTab==='credit-clear'"/>
      </el-tab-pane>
      <el-tab-pane label="代理授信记录" v-if="roleCheck('agent-record')" name="configuration-record">
        <configuration-record v-show="activeTab==='configuration-record'"/>
      </el-tab-pane>
      <el-tab-pane  label="层级调整记录" name="7">
        <user-leve-logs v-show="activeTab==='7'"/>
      </el-tab-pane>
      <el-tab-pane label="会员代充记录" v-if="roleCheck('member-record')" name="member-record">
        <member-record :member="member" v-show="activeTab==='member-record'"/>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import userInfo from './userInfo';
import userTrade from './userTrade';
import userLoginLogs from './userLoginLogs';
import UserArbitrage from './userArbitrage';
import UserBankLogs from './userBankLogs';
import UserOperateLogs from './userOperateLogs';
import MyAddress from '@/views/member/detail/myAddress';
import SettingRecord from './settingRecord';
import CreditClear from './creditClear';
import ConfigurationRecord from './configurationRecord';
import userLeveLogs from './userLeveLogs';
import memberRecord from './memberRecord';

export default {
  name: 'agency-detail',
  props: {
    member: {
      type: Object,
    },
  },
  components: {
    UserOperateLogs,
    UserBankLogs,
    UserArbitrage,
    userInfo,
    userTrade,
    userLoginLogs,
    MyAddress,
    SettingRecord,
    CreditClear,
    ConfigurationRecord,
    userLeveLogs,
    memberRecord,
  },
  data() {
    return {
      activeTab: 'one',
    };
  },
  mounted() {
    // tab页记录访问日志
    this.$store.dispatch(types.SAVE_OPERATION_LOG, { content: _.getContent(this.$route, '代理信息', true) });
  },
  methods: {
    changeTab(tab) {
      this.activeTab = tab.name;
      // tab页记录访问日志
      this.$store.dispatch(types.SAVE_OPERATION_LOG, { content: _.getContent(this.$route, tab.label, true) });
    },
  },
};
</script>

<style lang="scss" scoped>
</style>
